define("list", [], (require, exports, module) => {
	exports.done = () => {
		var html = (<div class="list">
			<ul p-express:if="'{{type}}' === 'normalList'">
				<li p-express:for="item in listData">
					<a href="" p-router:href="/goTo?d=listLink&u={{newsUrl | replaceHttp : //}}">
						<div>
							<img p-express:if="'{{newsPicture}}' !== ''" src="" p-lazyload="{{newsPicture}}" alt="{{title}}" />
						</div>
						<div class="list_item_content">
							<h1>{{title}}</h1>
							<p>{{title}}</p>
						</div>
					</a>
				</li>
			</ul>
			<div p-express:if="'{{type}}' === 'imgList'" class="img_list">
				<ul>
					<li p-express:for="item in listData" p-express:if="{{index}} < 15" data="{{index}} < 15">
						<a href="" p-router:href="/goTo?d=listLink&u={{newsUrl | replaceHttp : //}}" class="img_item">
							<div>
								<img p-express:if="'{{newsPicture}}' !== ''" src="" p-lazyload="{{newsPicture}}" alt="{{title}}" />
							</div>
							<div class="list_item_content">
								<h1>{{title}}</h1>
								<p>{{title}}</p>
							</div>
						</a>
					</li>
				</ul>
				<ul>
					<li p-express:for="item in listData" p-express:if="{{index}} >= 15" data="{{index}} >= 15">
						<a href="" p-router:href="/goTo?d=listLink&u={{newsUrl | replaceHttp : //}}" class="img_item">
							<div>
								<img p-express:if="'{{newsPicture}}' !== ''" src="" p-lazyload="{{newsPicture}}" alt="{{title}}" />
							</div>
							<div class="list_item_content">
								<h1>{{title}}</h1>
								<p>{{title}}</p>
							</div>
						</a>
					</li>
				</ul>
			</div>
		</div>);
		var css = @lessParse(<style>
			@base: 23.44/1rem;
			.list{
				.img_list{
					display:flex;
					ul{
						width:50%;
						&:first-child{
							li{
								margin-right:5/@base;
								a{
									div{
										&:last-child{
											margin:0;
										}
									}
								}
							}
						}
						&:last-child{
							li{
								margin-left:5/@base;
								a{
									div{
										&:last-child{
											margin:0;
										}
									}
								}
							}
						}
						li{
							-webkit-user-select: none;
							user-select:none;
							&.touchOn{
								position: fixed;
								top: 80/@base;
								left: 30/@base;
								right: 30/@base;
							}
						}
					}
				}
				ul{
					li{
						background-color:#fff;
						margin:10/@base;
						border-radius:5/@base;
						padding:10/@base;
						a{
							display:flex;
							&.img_item{
								display:block;
								div{
									margin:0;
									width:100%;
									&:first-child{
										width:100%;
									}
									&:last-child{
										width:100%;
									}
								}
							}
							div{
								margin:0;
								width:100%;
								&:first-child{
									width:30%;
									img{
										width:100%;
										border-radius:5/@base;
										height:60/@base;
									}
								}
								&:last-child{
									width:70%;
									margin-left:10/@base;
									text-align:left;
									h1{
										color:#000;
										font-size:16/@base;
										padding:0 0 10/@base 0;
									}
									p{
										color:#999;
										font-size:14/@base;
									}
								}
							}
						}
					}
				}
			}
		</style>);
		return {
			html:html,
			css:css,
			js:{}
		}
	};
});